.area-show{
    background-color: #fff;
    width:100%;
    height:200px;
    position: fixed;
    top: 138px;
    left:0;
    z-index: 100;
    .operation{
        padding-top:10px;
        padding-bottom: 10px;
        border-bottom: 1px solid #D6D6D6;
        button{
            font-size: 14px;
            color:#2994da;
            background-color: transparent;
        }
    }
    .area{
        .displaybox;
        padding-top:10px;
        padding-bottom: 10px;
        position: relative;
    }
    .area-detail{
        height:145px;
        ul,li{
            width:100%;
        }
        ul{
            position: relative;
            top:58px;
        }
        li{
            padding:5px 0;
        }
    }
    .area-detail,.area-op{
        .displaybox;
        .boxflex;
        overflow: hidden;
        color:#666;
    }
    .area-mask{
        position: absolute;
        z-index: 100;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        background: linear-gradient(#fff 0,rgba(245,245,245,0) 52%,rgba(245,245,245,0) 48%,#fff 100%);
        background: -webkit-gradient(linear,left bottom,left top,from(#fff),color-stop(.52,rgba(245,245,245,0)),color-stop(.48,rgba(245,245,245,0)),to(#fff));
        background: -webkit-linear-gradient(#fff 0,rgba(245,245,245,0) 52%,rgba(245,245,245,0) 48%,#fff 100%);
        background: -moz-linear-gradient(#fff 0,rgba(245,245,245,0) 52%,rgba(245,245,245,0) 48%,#fff 100%);
    }    
}
.mask,.areaMask{
    background: rgba(0,0,0,.7);
    width: 100%;
    height: 100%;
    position: fixed;
    top:0;
    left:0;
    z-index: 2;
}